<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../style/fjol_style.css"/>
		<link rel="stylesheet" type="text/css" href="../style/xol_style.css"/>
		<link href="../css/xzx_pull_refresh.css" rel="stylesheet" />
	</head>
	<style>
		*{
			font-size: 13px;
		}
	</style>
	<body>
		<script src="../js/mui.min.js"></script>
		<script src="../js/jquery-2.1.0.js"></script>
		<script src="../js/common.util.js"></script>
		<script src="../js/network.js"></script>
		<script src='../js/md5.js'></script>
		<script src="../js/xzx.open.js"></script>
		<div id="refreshContainer" class="mui-content mui-scroll-wrapper">
			<div class="mui-scroll">
				<!--数据列表-->
				<ul class="mui-table-view">

				</ul>
			</div>
		</div>

		<script type="text/javascript">
			var _type = 2; //1新房，2二手房，3租房
			var _pageNo = 1;
			var _lstData;
			
			mui.init({
				pullRefresh: {
					container: "#refreshContainer", //下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等
					down: {
						height: 50, //可选,默认50.触发下拉刷新拖动距离,
						auto: false, //可选,默认false.首次加载自动下拉刷新一次
						contentdown: "下拉可以刷新", //可选，在下拉可刷新状态时，下拉刷新控件上显示的标题内容
						contentover: "释放立即刷新", //可选，在释放可刷新状态时，下拉刷新控件上显示的标题内容
						contentrefresh: "正在刷新...", //可选，正在刷新状态时，下拉刷新控件上显示的标题内容
						callback: pulldownRefresh //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
					},
					up: {
						height: 50, //可选.默认50.触发上拉加载拖动距离
						auto: false, //可选,默认false.自动上拉加载一次 
						contentrefresh: "正在加载...", //可选，正在加载状态时，上拉加载控件上显示的标题内容
						contentnomore: '没有更多数据了', //可选，请求完毕若没有更多数据时显示的提醒内容；
						callback: pullUpLoadMore
					}
				}
			});
			
			mui.plusReady(function() {
				var centerView= plus.webview.currentWebview();
				var parentPage = centerView.parent();
				mui.fire(parentPage,'onClientSubPageReady');
				
			});
			
			document.addEventListener('configClientSubpage',function(event){
				_type = event.detail.type;
				mui('#refreshContainer').pullRefresh().pulldownLoading();
				console.log(_type);
			});
			//下拉刷新
			function pulldownRefresh() {
				mui('#refreshContainer').pullRefresh().enablePullupToRefresh();
				var ul = document.querySelector('.mui-table-view');
				_pageNo = 1;
				if(_type ==1){
					getMyNewHouseData(_pageNo, function(lstClient) {
						ul.innerHTML = '';
						if(lstClient.length > 0) {
							ul.insertBefore(createFragment(ul, lstClient, false), ul.firstChild);
						}else if(lstClient.length == 0) {
							var _li = document.createElement('li');
							_li.className = 'mui-text-center';
							_li.innerHTML = '<img src="../images/icon_blank.png"/>';
							ul.insertBefore(_li,null);
//							console.log(ul.innerHTML);
						}
						mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
					}, function() {
						mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
					});
				}else{
					getMyHouseData(_pageNo, _type, function(lstClient) {
						ul.innerHTML = '';
						if(lstClient.length > 0) {
							ul.insertBefore(createFragment(ul, lstClient, false), ul.firstChild);
						}else if(lstClient.length == 0) {
							var _li = document.createElement('li');
							_li.className = 'mui-text-center';
							_li.innerHTML = '<img src="../images/icon_blank.png"/>';
							ul.insertBefore(_li,null);
//							console.log(ul.innerHTML);
						}
						mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
					}, function() {
						mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
					});
				}
				
			}
			
			//上拉加载
			function pullUpLoadMore() {
				var ul = document.querySelector('.mui-table-view');
				_pageNo++;
				if(_type == 1){
					getMyNewHouseData(_pageNo,function(lstClient) {
						if(lstClient.length > 0) {
							ul.appendChild(createFragment(ul, lstClient, true));
						}
						mui('#refreshContainer').pullRefresh().endPullupToRefresh(lstClient.length);
					}, function() {
						mui('#refreshContainer').pullRefresh().endPullupToRefresh();
					});
				}else{
					getMyHouseData(_pageNo, _type, function(lstClient) {
						if(lstClient.length > 0) {
							ul.appendChild(createFragment(ul, lstClient, true));
						}
						mui('#refreshContainer').pullRefresh().endPullupToRefresh(lstClient.length);
					}, function() {
						mui('#refreshContainer').pullRefresh().endPullupToRefresh();
					});
				}
					
				
			}
			var getMyHouseData = function(page, kind, successCallback, failCallback) {
				
				var userInfo = common.myStorage.getItem('userInfo');
				var param = [{
					key: 'clientId',
					value: userInfo.clientId
				}, {
					key: 'kind',
					value: kind
				}, {
					key: 'page',
					value: page
				}, {
					key: 'rows',
					value: 10
				}];
				var net = fjNetwork;
				net.get('fjzx/client/house-reserve-list.json', param, function(data) {
					//成功
					_lstData = data.rows;
					successCallback(data.rows);
//					console.log(JSON.stringify(data));

				}, function(message) {
					//失败
					mui.toast(message);
					failCallback();
				});
			};
			var getMyNewHouseData = function(page, successCallback, failCallback) {
				
				var userInfo = common.myStorage.getItem('userInfo');
				var param = [{
					key: 'clientId',
					value: userInfo.clientId
				}, {
					key: 'page',
					value: page
				}, {
					key: 'rows',
					value: 10
				}];
				var net = fjNetwork;
				net.get('fjzx/client/new-building-reserve-list.json', param, function(data) {
					//成功
					_lstData = data.rows;
					successCallback(data.rows);
//					console.log(JSON.stringify(data));

				}, function(message) {
					//失败
					mui.toast(message);
					mui.alert(message);
					failCallback();
				});
			};
			var createFragment = function(ul, lstHouse) {
				var fragment = document.createDocumentFragment();
				var li;
				for(var i = 0; i < lstHouse.length; i++) {
					li = document.createElement('li');
					li.className = 'mui-table-view-cell';
					var houseInfo = lstHouse[i];
					li.id = houseInfo.id;
					var data = new Array();
//					console.log(JSON.stringify(houseInfo));
					var reserveDate = new Date(houseInfo.reserveDate).toLocaleDateString();
//					console.log(reserveDate);
					
					data.push('<div class="mui-clearfix">');
					data.push('<span class="mui-pull-left nowrap">'+houseInfo.area+' '+houseInfo.buildingName+' '+houseInfo.title+'</span>');
					if(houseInfo.houseReserveStateName=='未处理'){
					data.push('<button class="mui-btn mui-btn-grey mui-btn-outlined mui-pull-right p5 color9 cancelBtn f08">取消预约</button>');
					
					}
					data.push('</div>');
				    data.push('<div class="mui-media-body mt10" style="line-height: 1.6em;">');
				                            
				    data.push('<p class="mui-inline mr10">预约状态</p><span>'+houseInfo.houseReserveStateName+'</span><br />');
				    data.push('<p class="mui-inline mr10">预约时间</p><span>'+reserveDate+'</span><br />');
				    if(houseInfo.houseReserveStateName=='已取消'){
				    	data.push('<p class="mui-inline mr10">经纪人</p><span></span>');
				    }else{
				    	data.push('<p class="mui-inline mr10">经纪人</p><span>'+(houseInfo.salemanRealname?houseInfo.salemanRealname:"等待安排")+'</span>');
				    }
				    
					if(houseInfo.houseReserveStateName=='已处理'){
					data.push('<span class="evaluate mui-pull-right colorGreen p5 mb5" style="border:1px solid #05b160;">评价</span>');
					data.push('<span class=" mui-pull-right" style="width:32%">');
					data.push('</span>');
					}
					if(houseInfo.houseReserveStateName=='未处理'){
					data.push('<span class=" mui-pull-right" style="width:32%">');
					data.push('</span>');
					}
				    data.push('</div>');
					li.innerHTML = data.join('');
					fragment.appendChild(li);
				}
				return fragment;
			};
				mui('.mui-table-view').on('tap','.cancelBtn',function(){
					var li = $(this).closest('li');
					var _id = li.attr('id');
					var cancelParam = [{
						key:'reserveId',
						value:_id
					}];
					var _url;
					if(_type == 1){
						_url = 'fjzx/client/cancel-new-building-reserve.json';
					}else{
						_url = 'fjzx/client/cancel-house-reserve.json';
					}
//					console.log(_type);
					fjNetwork.post(_url,cancelParam,function(data){
						mui.toast(data.msg);
						mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
						var wv = plus.webview.currentWebview();
						wv.reload(true);
					})
//					console.log(_id);
				});
				
				mui('.mui-table-view').on('tap','.evaluate',function(){		//评价
					var _li = $(this).closest('li');
					var _idx;
					if(_li.index()>=10){
						_idx = _li.index()-10;
					}else{
						_idx = _li.index();
					}
					var houseInfo = _lstData[_idx];
//					console.log(JSON.stringify(houseInfo));
					openWindowWithPage('xol_agent_evaluate',{
						clientId:houseInfo.clientId,
						salemanId:houseInfo.salemanId,
						reserveId:houseInfo.id,
						kind:houseInfo.kind
					});
				});
				

//				mui('.mui-table-view').on('tap','.tophone-img',function(){
//					var _a = $(this).closest('a');
//					var mobile = _a.attr('id');
////					console.log(mobile);
//					var btnArray = ['拨打', '取消'];
//					mui.confirm('是否拨打' + mobile + '?', '提示', btnArray, function(e) {
//						if(e.index == 0) {
//							plus.device.dial(mobile, false);
//						}
//					});
//				});

		</script>
	</body>

</html>